<template>
  <div>
    <a-card :bordered="false">
      <f-search-form :more="true" @searchHandler="searchHandler" :tableObj="tableObj" :show-export-btn='true' export-url='exportUrl2'>
        <f-search-form-item label="区域"  name="areaName"   type="select"      valueKey="areaName" label-key="areaName" style="width:220px"/>
        <f-search-form-item label="部门" ref="dept"  name="deptId" type="select" :data="api.dept.list"  valueKey="deptId" label-key="deptName" style="width:220px"/>
      </f-search-form>
      <f-table ref="table"  rowKey="orderDetailsId" :showSetting="true"  :tableColumns="columns" :scroll="{x:true}"  :multiple="false" :operator="operator" :params="queryParam" :api="api.bod" handler="orderDetailsReportHandler">
         <span slot="orderNo" slot-scope="text, record, index">
            <span v-clipboard:copy="text" v-clipboard:success="onCopy" style="cursor:pointer">{{text}}</span>
        </span>
        <span slot="saleType" slot-scope="text, record">
        <template>
        <span>
          <a-tag v-if="text=='CHA'" color="blue">销售</a-tag>
          <a-tag v-if="text=='CHC'" color="blue">退货</a-tag>
          <a-tag v-if="text==3" color="blue">补货</a-tag>
          <a-tag v-if="text==4" color="blue">票折</a-tag>
        </span>
        </template>
      </span>
         <span slot="action" slot-scope="text, record">
          <template>
             <a @click="$refs.orderInfoDrawer.showDrawer(record)" >查看</a>
          </template>
       </span>
      </f-table>
    </a-card>

  </div>
</template>
<script>
  import api from './../../js/api'

  export default {
    name: 'MingXiList',
    components: {
      
    },
    data() {
      let me = this
      //操作按钮
      let operator = []
      let customFlag=this.$store.state.user.customFlag
      return {
        api: Object.assign(api, this.api),
        //列表初始化查询参数
        queryParam: {
          companyId:this.$store.state.user.companyId
        },
        tableObj:null,
        superAdmin: this.superAdmin,
        // 表头
        columns: [
          {
            title: '#',
            width: '70px',
            align: 'center',
            fixed: 'left',
            customRender: (text, record, index) => index + 1
          },
          {
            title: '操作',
            align: 'center',
            width: '180px',
            dataIndex:'action',
            fixed: 'left',
            scopedSlots: { customRender: 'action' }
          },
          {
            title: '日期',
            align: 'left',
            width: '80px',
            fixed: 'left',
            dataIndex: 'salePrice'
          },
          {
            title: '订单编号',
            align: 'left',
            fixed: 'left',
            width: '80px',
            dataIndex: 'orderNo',
            scopedSlots: { customRender: 'orderNo' }
          },
          {
            title: '单位名称',
            align: 'left',
            width: '80px',
            dataIndex: 'saleType'
          },
          {
            title: '业务员',
            align: 'left',
            width: '90px',
            dataIndex: 'customReturnState',
          },
          {
            title: '商务部门',
            align: 'left',
            width: '100px',
            dataIndex: 'customBondState'
          },
          {
            title: '区域',
            align: 'left',
            sorter: true,
            width: '100px',
            dataIndex: 'saleDate'
          },
          {
            title: '商品名称',
            align: 'left',
            width: '75px',
            sorter: true,
            dataIndex: 'saleManName'
          },
          
          {
            title: '规格',
            align: 'left',
            sorter: true,
            width: '120px',
            ellipsis: true,
            dataIndex: 'drugsName'
          },
          {
            title: '销售单价',
            align: 'left',
            width: '70px',
            ellipsis: true,
            dataIndex: 'drugsSpec'
          },
          {
            title: '数量',
            align: 'left',
            width: '70px',
            dataIndex: 'saleNum'
          },
          {
            title: '销售金额',
            align: 'left',
            width: '70px',
            dataIndex: 'salePrice'
          },
          {
            title: '回款金额',
            align: 'left',
            sorter: true,
            width: '100px',
            dataIndex: 'amount2'
          },
          {
            title: '回款日期',
            align: 'left',
            sorter: true,
            width: '100px',
            dataIndex: 'amount3'
          },
          {
            title: '应收金额',
            align: 'left',
            sorter: true,
            width: '100px',
            dataIndex: 'amount4'
          },
          {
            title: '实收金额',
            align: 'left',
            sorter: true,
            width: '100px',
            dataIndex: 'amount5'
          },
          {
            title: '收款单位',
            align: 'left',
            sorter: true,
            width: '100px',
            dataIndex: 'amount6'
          },
          {
            title: '收款银行',
            align: 'left',
            sorter: true,
            width: '100px',
            dataIndex: 'amount7'
          },
          {
            title: '退款金额',
            align: 'left',
            sorter: true,
            width: '100px',
            dataIndex: 'amount8'
          },
          {
            title: '退款银行',
            align: 'left',
            sorter: true,
            width: '100px',
            dataIndex: 'amount10'
          },
          {
            title: '退款单位',
            align: 'left',
            sorter: true,
            width: '100px',
            dataIndex: 'amount11'
          },
          {
            title: '余额',
            align: 'left',
            sorter: true,
            width: '100px',
            dataIndex: 'amount12'
          }
        ],
        operator: operator
      }
    },
    created() {
    },
    mounted() {
      this.tableObj=this.$refs.table
    },
    methods: {
      onCopy() {
        this.$message.success('复制成功!')
      },
      initSettle(record){
        // this.http.confirm(this, {
        //   content: '确认初始化结算吗?',
        //   url: api.payment.initSettlePayment,
        //   data: {
        //     orderDetailsId: record.orderDetailsId
        //   }
        // })
      },
      clearExport(){
        this.http.post(this, {
          url: this.api.bod.clearExportData
        })
      }
    }
  }
</script>
